<template>
	<div>
		<p>slot使用</p>

		<SonA>
			<!-- 插槽默认插入：template+内容 -->
			<!-- 注意：默认插槽是具名插槽，名称定义为v-slot:default，省略 -->
			<template>
				<slotTest></slotTest>
			</template>
		</SonA>
		<SonB>
			<!-- 使用具名插槽=>v-slot:+自定义名称，还有v-slot:可简写为# -->
			<template #SonBShow>
				<slotTest></slotTest>
			</template>
			<!-- 注意：#scop="ddd" scop为自定义的插槽名字，ddd为接收数据属性，template内可以用传递的数据-->
			<template #scop="ddd">{{ ddd.myData }}</template>
		</SonB>
	</div>
</template>
<script>
import SonA from "./SonA.vue";
import SonB from "./SonB.vue";
import slotTest from "./slotTest.vue";
export default {
	name: "",
	components: { SonA, SonB, slotTest },
	data() {
		return {
			isShow: true,
		};
	},
	mounted() {},
	methods: {
		ChangeShow() {
			this.isShow = !this.isShow;
		},
	},
};
</script>
<style lang="" scoped></style>
